<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>登录 - 后台管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" th:href="@{/layuiadmin/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/layuiadmin/style/admin.css}" media="all">
    <link rel="stylesheet" th:href="@{/myself/style/login.css}" media="all">
</head>
<body style="background-image: url('/myself/images/login.jpeg');background-repeat:no-repeat;background-size:100% 100%;">
<div class="layadmin-user-login layadmin-user-display-show" id="LAY-user-login" style="display: none;">
    <div class="layadmin-user-login-main">
        <div class="layadmin-user-login-box layadmin-user-login-header">
            <h2>欢迎登录 - 运营管理平台</h2>
        </div>
        <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-username" for="username"></label>
                <input type="text" name="username" id="username" lay-verify="required" placeholder="用户名"
                       class="layui-input">
            </div>
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="password"></label>
                <input type="password" name="password" id="password" lay-verify="required" placeholder="密码"
                       class="layui-input">
            </div>
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-xs7">
                        <label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="captchaCode"></label>
                        <input type="text" name="captchaCode" id="captchaCode" lay-verify="required" placeholder="图形验证码"
                               class="layui-input">
                    </div>
                    <div class="layui-col-xs5">
                        <div style="margin-left: 10px;">
                            <img alt="加载中" src="" class="layadmin-user-login-codeimg" id="verifyImg" onclick="generateCaptcha();">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <button id="enterSubmit" class="layui-btn layui-btn-fluid" lay-submit
                        lay-filter="LAY-user-login-submit">登 录
                </button>
            </div>
        </div>
    </div>

    <div class="layui-trans layadmin-user-login-footer">
        <p>Copyright © 2021 <a href="http://www.newera.com/" target="_blank">新时代网络科技</a></p>
    </div>

</div>
<script th:src="@{/layuiadmin/layui/layui.js}"></script>
<script th:src="@{/jquery/jquery-3.3.1.min.js}"></script>
<script>
var captchaId;
var captchaCode;
$(function() {
	$("#username").focus();
	generateCaptcha();
});
function generateCaptcha() {
	$.ajax({
		url: '/generate/captcha',
		type: 'post',
		success: function(result) {
			$('#verifyImg').attr("src", result.pic);
			captchaId = result.captchaId;
			captchaCode = result.captchaCode;
		},
		error: function(e) {
			console.log(e);
		}
	});
}
$(document).keydown(function(event) {
	if (event.keyCode == 13) {
		$("#enterSubmit").click();
	}
});
;!function() {
	var form = layui.form;
	$ = layui.jquery;
	//监听提交
	form.on('submit(LAY-user-login-submit)',
	function(data) {
		if (captchaCode == null || captchaCode.toLowerCase() != data.field.captchaCode.toLowerCase()) {
			layer.msg("验证码输入有误");
			return false;
		}
		$.extend(data.field, {
			captchaId: captchaId
		});
		var jsonData = JSON.stringify(data.field);
		var index = layer.load(3,{offset: ['460px','1330px']});
		$.ajax({
			url: '/login/auth',
			type: 'post',
			contentType: "application/json",
			dataType: 'json',
			data: jsonData,
			success: function(data) {
				//var result = JSON.parse(data);
				if (data.transactionStatus.success) {
					var userInfo = {
						id: data.id,
						username: data.username
					};
					layui.data('admin', {
						key: 'userInfo',
						value: userInfo
					});
					window.location = '/main/html';
				} else {
					layer.msg(data.transactionStatus.replyText);
					$("#verifyImg").trigger("click");
				}
			},
			complete: function(data) {
				layer.close(index);
			}
		});
		return false; //为了不让页面跳转刷新
	});
}();
$(document).ready(function () {
    if (window != top) {
        top.location.href = location.href;
    }
});
</script>
</body>
</html>